﻿@using KelonProud
@using KelonProud.Mvc.Models
@using KelonProud.TableManagement.Dtos.DataBase
@model  KelonProud.TableManagement.Dtos.DataBase.DataBaseInput

@{
    Layout = "~/Views/Shared/_EditMaster.cshtml";
}

<div class="box from-box modal-box">
    @*<div class="box-header with-border">
            <h3 class="box-title">创建菜单</h3>
        </div>*@
    <form class="form-horizontal" id="EditForm" name="EditForm" validate method="post" role="form">
        @Html.HiddenFor(f => f.Id)
        <div class="box-body">
            <ul class="nav nav-tabs tab-nav-right" role="tablist">
                <li role="presentation" class="active"><a href="#edit-navigation-details" data-toggle="tab">数据库配置</a></li>
            </ul>

            <div class="tab-content">
                <div role="tabpanel" class="tab-pane animated fadeIn active" id="edit-navigation-details">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">数据库引擎</label>
                        <div class="col-sm-10">
                            @Html.Partial("~/Views/Shared/Modals/Components/_DropDownSelectView.cshtml", new DropDownSelectModel
                       {
                           Url = "/api/services/table/kelonDataBase/getDataBaseTypeJson",
                           Name = "Type",
                           Value = ((byte)Model.Type).ToString(),
                           IdKey = "id",
                           TextKey = "name",
                           OnChangedEvent = "onChangeType"
                       })
                        </div>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">名称</label>
                        <div class="col-sm-10">
                            @Html.TextBoxFor(f => f.Name, new { @class = "form-control validate" })
                            <span class="help-block m-b-none">该数据库在系统中的别名</span>
                        </div>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">IP地址</label>
                        <div class="col-sm-8">
                            @Html.TextBoxFor(f => f.ConfigIp, new { @class = "form-control validate", data_inputmask = "'alias': 'ip'" })
                            <span class="help-block m-b-none">数据库所在IP地址</span>
                        </div>
                        <div class="col-sm-2">
                            <div class="input-group spinner" data-trigger="spinner">
                                @Html.TextBoxFor(f => f.ConfigPort, new { @class = "form-control", placeholder = "端口号", @data_min = "0", data_max = "99999", data_step = "1", data_rule = "quantity" })
                                <span class="input-group-addon">
                                    <a href="javascript:;" class="spin-up" data-spin="up"><i class="fa fa-caret-up"></i></a>
                                    <a href="javascript:;" class="spin-down" data-spin="down"><i class="fa fa-caret-down"></i></a>
                                </span>
                            </div>
                        </div>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">数据库名称</label>
                        <div class="col-sm-10">
                            @Html.TextBoxFor(f => f.ConfigName, new { @class = "form-control validate" })
                            <span class="help-block m-b-none">数据库名称</span>
                        </div>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">用户</label>
                        <div class="col-sm-10">
                            @Html.TextBoxFor(f => f.ConfigUser, new { @class = "form-control validate" })
                            <span class="help-block m-b-none">当前数据库用户名</span>
                        </div>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">密码</label>
                        <div class="col-sm-10">
                            @Html.TextBoxFor(f => f.ConfigPassWord, new { @class = "form-control validate" })
                            <span class="help-block m-b-none">当前数据库的用户密码</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @Html.Partial("~/Views/Shared/Modals/_ModalFooterWithSaveAndCancel.cshtml")
    </form>
</div>

@section styles {
    <style>
        .menu-ico {
            color: #246f71;
            border-radius: 0;
        }


        .layui-layer-iframe .layui-layer-content {
            height: calc(100% - 100px);
            height: -moz-calc(100% - 100px);
            height: -webkit-calc(100% - 100px);
        }
    </style>
}

@section scripts{
    <script>
        $(function() {
            onChangeType({id:"@(Model.Type.ToInt16())"});
        });

        function onChangeType(data) {
            switch (data.id) {
            case "0":
                changePort("1433");
                break;
            case "1":
                changePort("1521");
                break;
            case "2":
                changePort("3306");
                break;
            case "3":
                changePort("5000");
                break;
            case "4":
                changePort("0");
                break;
            case "5":
                changePort("0");
                break;
            default:
                changePort("0");
            }
        }

        function changePort(port) {
            if (port === "0") {
                $("#ConfigPort").attr("disabled");
                $("#ConfigPort").val(0);
            } else {
                $("#ConfigPort").removeAttr("disabled");
                $("#ConfigPort").val(port);
            }
        }

        function saveFormEvent(_$form) {
            var _navService = abp.services.table.kelonDataBase;
            var obj = _$form.serializeFormToObject(); //serializeFormToObject is defined in main.js

            abp.ui.setBusy(_$form);
            _navService.save(obj).done(function() {
                if (obj.Id === 0) {
                    abp.notify.success("数据源创建成功！");
                } else {
                    abp.notify.success("数据源修改成功！");
                }

                DiyWindow.closeModal();

            }).always(function() {
                abp.ui.clearBusy(_$form);
            });
        }
    </script>
}